import React from 'react';
import {inject, observer} from 'mobx-react';
import SignPanelBottom from './SianPanelBottom';
import SignActionPanel from './signActionPanel';
import {withRouter} from 'react-router-dom';
import * as SignUtil from '../../util/SignUtil';
import * as VariableKeys from '../../constants/variableKey';
import * as EmSDK from "../../util/emSDK";
import Reply from '../signList/Reply';

//流程底部操作入口
@inject('wfSignInputStore', 'wfSignListStore')
@withRouter
@observer
export default class Main extends React.Component {

    render() {
        const showSignArea = SignUtil.getVariableMapVal(VariableKeys.SHOW_SIGN_AREA,false);
        const emBottomBtn = EmSDK.judgeApiSupport('showBottomToolBar') || false;
        const { showReply, replyInfo={} } = this.props.wfSignListStore;
        return (
            <div className='wf-bottomOperate-wrap' style={{'borderTop':`${emBottomBtn ? '0px' : '1px'} solid #DDD`}}>
                {showSignArea&& !showReply && <SignActionPanel/>}
                {!emBottomBtn && !showReply && <SignPanelBottom/>}
                <div className={showReply ? "footer-reply-input " : "footer-reply-input show-reply"}>
                  <Reply info={replyInfo} store={this.props.wfSignListStore} />
                </div>
            </div>
        )
    }
}